{% extends "school/layout.html" %}

{% set page_title = translate('实名认证') %}

{% block content %}
<div class="wrapper">
    <div class="title" id="title-top" align="center">
        <h1 class="title-h1">申请成为The ONE经销店</h1>
        <div class="title-line" id="title_line">
            <span class="span-line span-first span-active" data-id="step_one">
                1、阅读并同意经销协议内容
                <span class="glyphicon glyphicon-ok-circle grey" id="title-one"></span>
            </span>
            <span class="span-line not-allowed" data-id="step_two" id="line-two">
                2、关联同一门店的其它教室的机构代码<span class="span_small" id="span_small">(适用于一间门店开设>=2间教室)</span>
                <span class="glyphicon glyphicon-ok-circle"></span>
            </span>
            <span class="span-line not-allowed" id="line-three" data-id="step_three">
                3、填写门店信息，提交认证审核
                <span class="glyphicon glyphicon-ok-circle grey"></span>
            </span>
        </div>

    </div>
    <div class="steps">
        <!-- 1 -->
        <div class="step-one" id="step_one" align="center">
            <div class="one-content" align="center">
                <h1 style="font-size:24px;">运营协议和产品经销协议</h1>
                {#<button type="button" class="btn btn-primary one-down"><a href="http://qn-doremi.xiaoyezi.com/bargain/The%20ONE%E4%BA%A7%E5%93%81%E7%BB%8F%E9%94%80%E5%90%88%E5%90%8C%EF%BC%88%E9%92%A2%E7%90%B4%E9%94%80%E5%94%AE%E7%B1%BB%EF%BC%8920171212%E6%B8%85%E6%B4%81%E7%89%88.docx" download="XXX协议" style="color:#fff"><span class="glyphicon glyphicon-download-alt"></span>&nbsp;&nbsp;&nbsp;下载</a></button>#}
                <div class="p-main">
                    <iframe src="{{url_for('school.agreement')}}" style="width: 100%;height: 480px;"></iframe>
                </div>
            </div>
            <div class="one-footer">
                <input type="checkbox" id="footer-box">&nbsp;作为门店负责人，我已<span class="red">阅读并同意</span>以上协议内容  <br>
                <button type="button" class="btn btn-success one-next not-allowed" id="one-next">下一步</button>
                <span class="red span-warn hide" id="agreement">请先阅读并同意《XXX经销协议》后进入下一步！</span>
            </div>
        </div>
        <!-- 2 -->
        <div class="step-two hide" id="step_two">
            <div class="two-top">
                <p><span class="red">*</span>为了避免重复认证，同一个门店地址拥有2间及以上教室，可以将其它教室添加关联后，再进行门店信息认证；</p>
                <p><span class="red">*</span>已被关联的教室，无需再次申请经销店，且门店信息可在已认证的经销店后台进行查看；</p>
                <p><span class="red">*</span>同一个门店地址，只有一间教室的，不需要添加关联教室，直接点击下一步，填写门店信息进行认证。</p>
            </div>
            <p class="two-p">
                本次申请经销店认证的机构为：<span class="p-id"></span>
                <button type="button" class="btn btn-success two-add" id="two-add">+添加关联教室</button>
            </p>
            <div class="two-main">
                <p class="main-p">已关联教室</p>
                <p class="main-main" id="main-main">暂无已关联教室！</p>
            </div>
            <div class="two-box hide" id="two-box" align="left">
                <span class="two-close" id="two-close">X</span>
                <h3>添加关联教室</h3>
                <div class="box-content">
                    教室机构代码：<input class="box-input form-control" type="text" width="200" id="input_one">
                    <span class="glyphicon glyphicon-ok-circle green spot hide" id="correct1"></span>
                    <p class="box-p hide" id="classroom-name"></p>
                    <p class="box-p red hide" id="box-id">机构代码无效！</p>
                    <p>
                        机构后台密码：<input class="box-input form-control" type="password" id="input_two">
                        <span class="glyphicon glyphicon-ok-circle green spot hide" id="correct2"></span>
                    </p>
                    <p class="box-p red hide" id="pass-error"></p>
                    <p class="box-p hide" id="pass-miss"><span class="red" id="pass_span">密码无效！</span> 立即 <a href="{{url_for('school.school_password_retrieve')}}" target="_blank" class="purple">"重置密码>>"</a></p>
                </div>
                <p class="red" style="text-align:center;">(提交后不可修改)</p>
                <button type="button" class="btn btn-success two-sub" id="two-sub">提交</button>
            </div>
            <button type="button" class="btn btn-success two-next" id="two-next">下一步</button>
        </div>
        <!-- 3 -->
        <div class="m-content real-name-auth hide" id="step_three" style="padding-top: 0;">
            <form class="form-horizontal" id="auth-form">
                <fieldset class="fieldset">
                    <legend style="padding:0 200px 10px 40px;">{{translate('机构信息')}}
                        <span style="color:#777;font-size:15px;">
                            （{{translate('操作提示：请认真填写完成并点击“提交审核”，上传的照片每张限制在8M以内')}}）
                        </span>
                        <span class="three-p">
                                本次申请经销店认证的机构为：<span class="p-id">XYZ001</span>
                        </span>
                        <!-- <button class="btn" type="button" id="modify" style="float: right;vertical-align:middle;border: 1px solid #ccc;">修改</button> -->
                    </legend>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="school_name">
                            <span class="dot-tips"> *</span>
                            机构名称
                        </label>
                        <div class="col-sm-8">
                            <input class="form-control" id="school_name" name="school_name" required type="text" value="{{default.school_name}}" aria-required="true">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="school_scale">
                            <span class="dot-tips"> *</span>
                            团队规模
                        </label>
                        <div class="col-sm-8">
                            <select name="school_scale" class="form-control valid" required id="school_scale">
                                {% for scale in scale_options %}
                                <option value={{ scale[0] }} {% if scale[0] == default.school_scale %} selected {% endif %}>{{ scale[1] }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="contact_name">
                            <span class="dot-tips"> *</span>
                            联系人
                        </label>
                        <div class="col-sm-8">
                            <input class="form-control" id="contact_name" name="contact_name" required type="text" value="{{default.contact_name}}" aria-required="true">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="contact_phone">
                            <span class="dot-tips"> *</span>
                            联系电话
                        </label>
                        <div class="col-sm-8">
                            <input class="form-control" id="contact_phone" name="contact_phone" required type="text" value="{{default.contact_phone}}" aria-required="true">
                            <button class="btn-sm" id="sendPhone" type="button">发送验证码</button>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="vcode">
                            <span class="dot-tips"> *</span>
                            短信验证码
                        </label>
                        <div class="col-sm-8">
                            <input class="form-control" id="vcode" name="vcode" required type="text" value="" aria-required="true">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="contact_email">
                            <span class="dot-tips"> *</span>
                            Email
                        </label>
                        <div class="col-sm-8">
                            <input class="form-control" id="contact_email" name="contact_email" required type="text" value="{{default.contact_email}}" aria-required="true">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">
                            银行对公账号
                        </label>
                        <div class="col-sm-8">
                            <input style="width: 200px" class="form-control" id="business_account" name="business_account" type="text" value="" aria-required="false" placeholder="账号">
                            <input style="width: 200px" class="form-control" id="bank" name="bank" type="text" value="" aria-required="false" placeholder="开户行">
                            <input style="width: 200px" class="form-control" id="account_name" name="account_name" type="text" value="" aria-required="false" placeholder="户名">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="address">
                            <span class="dot-tips"> *</span>
                            机构经营地址
                        </label>
                        <div class="col-sm-8">
                            <select style="width: 200px" class="form-control valid" required id="province">
                                <option value=''>请选择</option>
                            </select>
                            <select style="width: 200px" class="form-control valid" required id="city">
                                <option value=''>请选择</option>
                            </select>
                            <select style="width: 200px" class="form-control valid" required id="county" name="area_code">
                                <option value=''>请选择</option>
                            </select>
                            <input class="form-control" id="address" name="address" required type="text" value="{{default.school_address}}" aria-required="true">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="school_type">
                            <span class="dot-tips"> *</span>
                            机构类型
                        </label>
                        <div class="col-sm-8">
                            <select name="school_type" class="form-control valid" required id="school_type">
                                {% for type in type_options %}
                                <option value={{ type[0] }} {% if type[0] == default.school_type %} selected {% endif %}>{{ type[1] }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">
                            <span class="dot-tips"> *</span>
                            经营面积
                        </label>
                        <div class="col-sm-8">
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="area-1" name="area" type="radio" value="1">
                                <label for="area-1">&lt;100m<sup>2</sup></label>
                            </label>
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="area-2" name="area" type="radio" value="2">
                                <label for="area-2">100m<sup>2</sup>~150m<sup>2</sup></label>
                            </label>
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="area-3" name="area" type="radio" value="3">
                                <label for="area-3">&gt;150m<sup>2</sup></label>
                            </label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="piano_sales">
                            <span class="dot-tips"> *</span>
                            TheONE钢琴销售
                        </label>
                        <div class="col-sm-8">
                            <input style="width: 200px" class="form-control" id="ep_amount" name="ep_amount" type="text" placeholder="电钢">台/月
                            <input style="width: 200px" class="form-control" id="op_amount" name="op_amount" type="text" placeholder="原钢">台/月
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="student_amount">
                            <span class="dot-tips"> *</span>
                            当前学生数量
                        </label>
                        <div class="col-sm-8">
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="student_amount-1" name="student_amount" type="radio" value="1">
                                <label for="student_amount-1">&lt;20人</label>
                            </label>
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="student_amount-2" name="student_amount" type="radio" value="2">
                                <label for="student_amount-2">20~49人</label>
                            </label>
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="student_amount-3" name="student_amount" type="radio" value="3">
                                <label for="student_num-3">&ge;50人</label>
                            </label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="business_category">
                            <span class="dot-tips"> *</span>
                            经营品类
                        </label>
                        <div class="col-sm-8">
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="business_category-1" name="business_category" type="radio" value="1">
                                <label for="business_category-1">只有TheONE品牌</label>
                            </label>
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="business_category-2" name="business_category" type="radio" value="2">
                                <label for="business_category-2">主营TheONE品牌</label>
                            </label>
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="business_category-3" name="business_category" type="radio" value="3">
                                <label for="business_category-3">弱经营TheONE品牌</label>
                            </label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="" class="col-sm-2 control-label">
                                <span class="dot-tips"> *</span>
                                法人资质照片
                        </label>
                        <div class="col-sm-8">
                            <label class="form-inline upload-wrapper">
                                <div class="upload-text">
                                    <label for="lp_pic_front">法人身份证照片面</label>
                                    <div class="btn-default upload-btn">
                                        上传图片
                                        <input type="file" id="lp_pic_front" name="lp_pic_front" data-src="">
                                    </div>
                                </div>
                                <div class="uploadImg">
                                    <img src="" class="pre-view" data-key="lp_pic_front">
                                </div>
                            </label>
                            <label class="form-inline upload-wrapper">
                                <div class="upload-text">
                                    <label for="lp_pic_back">法人身份证国徽面</label>
                                    <div class="btn-default upload-btn">
                                        上传图片
                                        <input type="file" id="lp_pic_back" name="lp_pic_back" data-src="">
                                    </div>
                                </div>
                                <div class="uploadImg">
                                    <img src="" class="pre-view" data-key="lp_pic_back">
                                </div>
                            </label>
                            <label class="form-inline upload-wrapper">
                                <div class="upload-text">
                                    <label for="business_license">营业执照照片</label>
                                    <div class="btn-default upload-btn">
                                        上传图片
                                        <input type="file" id="business_license" name="business_license" data-src="">
                                    </div>
                                </div>
                                <div class="uploadImg">
                                    <img src="" class="pre-view" data-key="business_license">
                                </div>
                            </label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="">
                            <span class="dot-tips"> *</span>
                            营业执照注册号
                        </label>
                        <div class="col-sm-8">
                            <input style="width: 490px" class="form-control" id="business_code" name="business_code" type="text">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="">
                            <span class="dot-tips"> *</span>
                            营业执照名称
                        </label>
                        <div class="col-sm-8">
                            <input style="width: 490px" class="form-control" id="business_name" name="business_name" type="text">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="">
                            <span class="dot-tips"> *</span>
                            身份证号
                        </label>
                        <div class="col-sm-8">
                            <input style="width: 490px" class="form-control" id="id_card_no" name="id_card_no" type="text">
                        </div>
                    </div>
                    <!-- <div class="form-group">
                        <label class="col-sm-2 control-label" for="classroom_token">
                            <span class="dot-tips"> *</span>
                            教室加密狗代码
                        </label>
                        <div class="col-sm-8">
                            <select style="width: 140px" id="token" class="form-control valid" required><option value=''>请选择</option></select>
                            <input style="width: 180px" class="form-control" id="user_token" name="user_token" required type="text">
                            <label for="classroom_token" style="margin-left: 15px;">示例：</label>
                            <input style="width: 180px" class="form-control" id="classroom_token" name="classroom_token" required type="text" readonly>
                        </div>
                    </div> -->
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="buy_way">
                            <span class="dot-tips"> *</span>
                            购买途径
                        </label>
                        <div class="col-sm-8">
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="buy_way-1" name="buy_way" type="radio" value="1">
                                <label class="" for="buy_way-1">通过总部购买</label>
                            </label>
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="buy_way-2" name="buy_way" type="radio" value="2">
                                <label class="" for="buy_way-2">通过代理商购买</label>
                            </label>
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="buy_way-3" name="buy_way" type="radio" value="3">
                                <label class="" for="buy_way-3">通过转让购买</label>
                            </label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="lp-picture" class="col-sm-2 control-label">
                            <span class="dot-tips"> *</span>
                            教室照片
                        </label>
                        <div class="col-sm-8">
                            <label class="form-inline upload-wrapper">
                                <div class="upload-text">
                                    <label for="front_pic">店门脸照片 <br><span class="marked-words">（ 需包含门头）</span></label>
                                    <div class="btn-default upload-btn">
                                        上传图片
                                        <input type="file" id="front_pic" name="front_pic" data-src="">
                                    </div>
                                </div>
                                <div class="uploadImg">
                                    <img src="" class="pre-view" data-key="front_pic">
                                </div>
                            </label>
                            <label class="form-inline upload-wrapper">
                                <div class="upload-text">
                                    <label for="stage_pic" style="height:40px;line-height:40px">前台照片</label>
                                    <div class="btn-default upload-btn">
                                        上传图片
                                        <input type="file" id="stage_pic" name="stage_pic" data-src="">
                                    </div>
                                </div>
                                <div class="uploadImg">
                                    <img src="" class="pre-view" data-key="stage_pic">
                                </div>
                            </label>
                            <label class="form-inline upload-wrapper">
                                <div class="upload-text">
                                    <label for="classroom_pic">教室照片 <br><span class="marked-words">（需包含整套教室内容）</span></label>
                                    <div class="btn-default upload-btn">
                                        上传图片
                                        <input type="file" id="classroom_pic" name="classroom_pic" data-src="">
                                    </div>
                                </div>
                                <div class="uploadImg">
                                    <img src="" class="pre-view" data-key="classroom_pic">
                                </div>
                            </label>
                            <label class="form-inline upload-wrapper">
                                <div class="upload-text">
                                    <label for="panorama_pic">临街全景照片 <br><span class="marked-words">（需包含本店的临街全景）</span></label>
                                    <div class="btn-default upload-btn">
                                        上传图片
                                        <input type="file" id="panorama_pic" name="panorama_pic" data-src="">
                                    </div>
                                </div>
                                <div class="uploadImg">
                                    <img src="" class="pre-view" data-key="panorama_pic" data-key="">
                                </div>
                            </label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="business_category" style="width:755px;">
                            <span class="dot-tips"> *</span>
                            是否与The ONE之外的其他第三方签署过协议（有关<span class="red">区域保护</span>、产品转让或其它运营相关协议）
                        </label><br>
                        <div class="col-sm-12" style="margin-left:240px;margin-top:5px;">
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="lp_file_1" name="third_party" type="radio" value="2">
                                <label for="lp_file_1">是［需要上传协议文件（附件内容为纸质协议照片或者电子版协议的压缩文件，大小在30M以内）］</label>
                            </label>
                            <div class="btn-default upload-btn" style="width: 80px;text-align: center;margin-top: 0px;padding-bottom: 0px;display: inline-block;">
                                <label for="treaty_file">上传文件</label>
                                <input type="file" id="treaty_file" name="treaty_file" data-src="">
                            </div>
                            <a href="" download="" id="agreement_down" style="color: #480bff;text-decoration: underline;margin-left: 3px;"></a>
                            <br>
                            <label class="form-inline" style="margin-right: 14px;">
                                <input id="lp_file_2" name="third_party" type="radio" value="1">
                                <label for="lp_file_2">否</label>
                            </label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="">
                            备注
                        </label>
                        <div class="col-sm-8">
                            <textarea style="width: 850px;height:100px;resize: none;" class="form-control" name="school_comment" id="school_comment" placeholder="需要获得什么帮助？200字以内" ></textarea>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="must_check" class="col-sm-2 control-label">
                        </label>
                        <div class="col-sm-8">
                            <input class="" id="must_check" name="must_check" required type="checkbox">
                            <label for="must_check">本人确认以上信息真实有效</label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="contact_phone">
                        </label>
                        <div class="col-sm-8">
                            <button class="btn btn-success" id="sendVerify" type="button">提交审核</button>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="" class="col-sm-2 control-label">
                        </label>
                        <div class="col-sm-8">
                            <label for="" style="color: green">提示：总部确保以上所填写的信息具有保密性</label>
                        </div>
                    </div>
                </fieldset>
            </form>
        </div>
    </div>
    <div class="result-wrapper counting">
        <h2 class="result-title">机构信息审核中，请耐心等待...</h2>
        <div class="content">
            <p>请耐心等待总部运营人员审核~</p>
            <p>人工客服工作时间是：周一至周日 09:00-19:00</p>
            <p>您可以直接拨打4001108770转2，或联系企业QQ号：4001108770 与人工客服沟通</p>
        </div>
    </div>
    <div class="result-wrapper refuse">
        <h2 class="result-title grey">审核不通过</h2>
        <div class="content">
            <p class="reason">原因：<span class="comment">{{ default.comment }}</span></p>
            <p>请重新填写信息后再次提交审核！ 人工客服工作时间是：周一至周日 09:00-19:00</p>
            <p>您可以直接拨打4001108770转2，或联系企业QQ号：4001108770 与人工客服沟通</p>
        </div>
        <div class="footer">
            <button class="btn btn-success" id="continue">重新填写信息</button>
        </div>
    </div>
    <div id="addBox" class="addBox hide">提交成功</div>
</div>
{% endblock %}

{% block js %}
<script type="text/javascript">

</script>
<script type="text/javascript">
	var countDown = 60
    var isCounting = false
    var t
    var defaultData = {}
    var second = false,third=false
    {% for key, value in default.items() %}
        defaultData["{{ key }}"] = "{{ value | urlencode }}"
    {% endfor %}

    for(key in defaultData){
        defaultData[key] = decodeURIComponent(defaultData[key])
    }
    var schools_all = JSON.parse(defaultData['associated_schools'])
    var associated_schools = [];


    // pass
    var province_code = defaultData['province_code']
    var city_code = defaultData['city_code']
    var county_code = defaultData['area_code']
    // var classroom_token = defaultData['classroom_token']
    var flag = 0
	$(function(){
        $('.p-id').text(defaultData.school_code)
        // 地区
        // queryProvince()
        // // 加密狗
        // getSoftDog()

        var util = {
            showLoading: function(option) {
                var option = $.extend({}, {
                    word: '正在加载..',
                    type: 'line',
                    callback: function() {}
                }, option)
                var html = ''
                if (option.type === 'line') {
                    html = lineHtml(option.word)
                }
                $('body').append(html)
                $('body').on('click', '.k-loading .loading-btn', function(e) {
                    callback()
                    $('.k-loading').remove()
                })
                setTimeout(function() {
                    $('.k-loading .loading-btn').fadeIn(400)
                }, 8000)
            },
            hideLoading: function() {
                setTimeout(function() {
                    $('.k-loading').fadeOut().remove()
                }, 700)
            }
        }

        util.showLoading()
        queryProvince()
        queryCity()
        queryCounty()
        // getSoftDog()

        function switchStatus() {
            switch(defaultData.status){
                case "2": // 机构信息已提交，等待审核
                    $('#title-top').css('display', 'none')
                    $('.steps').css('display', 'none')
                    $('.refuse').css('display', 'none')
                    $('.counting').css('display', 'block')
                    break;
                case "1": // 审核通过，只读展示审核过的信息，也可以修改信息重新提交
                    $('#title-top').css('display', 'none')
                    $('.steps').css('display', 'none')
                    $('.title-h1').text('已通过经销店资质审核')
                    fill_data();
                    kalert('您已通过经销店资质审核。您可以在此页面修改您的信息，我们会重新审核您修改过的信息。');
                    // disabledForm();
                    break;
                case "0": // 审核不通过，提示修改信息，重新提交
                    $('#title-top').css('display', 'none')
                    $('.steps').css('display', 'none')
                    $('.counting').css('display', 'none')
                    $('.refuse').css('display', 'block')
                    $('#modify').css('display', 'none')
                    break;
                default: // undefined，代表新机构从来没有审核过信息
                    // $('#auth-form').css('display', 'block')
                    break;
            }
            util.hideLoading()
        }
        function setTime(val){
	      if(isCounting){
	          val.attr('disabled','disabled')
	          val.addClass('btn-disable')
	          val.html('{{translate("在")}}'+countDown+'{{translate("秒后重新发送")}}')
	          countDown--
	          if(countDown<0){
	              isCounting = false
	              countDown = 60
	          }
	      }else{
	          val.removeAttr('disabled')
	          val.removeClass('btn-disable')
	          val.html('{{translate("发送验证码")}}')
	          clearTimeout(t)
	          return false
	      }
	      t = setTimeout(function(){
	          setTime(val)
	      },1050)
	    }

		$('#sendPhone').click(function(e){
			e.preventDefault()
			var phone = $('#contact_phone').val()
			var $this = $(this)
			var pReg = new RegExp('^[0-9]{11}$')
			if(pReg.test(phone)){
                $.post('/vcode/send_vcode', {'phone': phone}, function(data) {
                    var d = JSON.parse(data)
                    if(d.meta.code == 0){
                        isCounting = true
                        setTime($this)
                    }else{
                        if(d.meta.code == 1){
                            kalert('{{translate("验证码不正确，请重新输入")}}')
                        }else if(d.meta.code == 2){
                            kalert('{{translate("发验证码失败，请稍后再试")}}')
                        }
                    }
                    })
			} else {
                kalert('{{translate("输入的手机号不符合规范！")}}')
			}
		})

        // modal
        function modal(option) {
            var option = $.extend({}, {
                title: '提示',
                content: '',
                width: '50%',
                isImg: true,
                src: '',
                hide:'hide',
                show:'',
                callback: function() {}
            }, option)

            var html = '<div class="m-modal-wrapper"><div class="mask"></div><div class="m-modal" style="width:' + option.width + '"><div class="m-modal-title">' + option.title + '</div><div class="m-modal-body">' + option.content + '</div><div class="m-modal-footer"><button type="button" class="entry btn btn-success '+ option.hide +'" style="margin-right:90px;">立即查看</button><button type="button" id="go_index" class="cancle btn btn-default '+ option.hide +'" style="margin-right:45px;" ><a href="/school/index">稍后提示</a></button><button type="button" class="cancle btn btn-default '+ option.show +'">关闭</button></div></div></div>'

            if (option.isImg) {
                var preImgHtml = '<img class="pre-img" src="' + option.src +  '" alt="">'
                $('body').append(html)
                $('.m-modal-wrapper').find('.m-modal-body').append(preImgHtml)
            }
            $('.m-modal-wrapper').fadeIn(200)

            $('.m-modal-wrapper').find('.mask').click(function() {
                $(this).parents('.m-modal-wrapper').fadeOut(200, function() {
                    $('.m-modal-wrapper').remove()
                })
            })
            $('.m-modal-wrapper').on('click', 'button', function() {
                $(this).parents('.m-modal-wrapper').fadeOut(200, function() {
                    $('.m-modal-wrapper').remove()
                })
                if ($(this).hasClass('confirm')) {
                    option.callback()
                    console.log('done callback')
                }
            })
        }


        function message(option) {
            var option = $.extend({}, {
                type: 'warning',
                word: ''
            }, option)
            var html = '<div class="message-wrapper ' + option.type + '"><div class="message">' + option.word + '</div></div>'

            $('body').append(html)
            $('.message-wrapper').slideDown(300)
            setTimeout(function() {
                $('.message-wrapper').slideUp(function() {
                    $(this).remove()
                })
            }, 2000)
        }

        function lineHtml(word) {
            return '<div class="k-loading"><div class="loading-content"><div class="line"> <div class="line1"></div> <div class="line2"></div> <div class="line3"></div> <div class="line4"></div> <div class="line5"></div> </div><div class="loading-word">' + word + '</div></div></div>'
        }

        $('.real-name-auth').on('change', 'input[type="file"]', function(){
            var key = $(this).attr('id')
            var show_word = key === 'treaty_file' ? '正在上传文件' : '正在上传图片'
            var show_word1 = key === 'treaty_file' ? '文件大小不能超过30M' : '图片大小不能超过2M'
            var temp_src = key === 'treaty_file' ? 'compress' : 'pic'
            var file = $(this)[0].files[0]
            var url = '/school/upload/' + temp_src
            var src
            var that = $(this)
            if (file) {
                var isLt2M = file.size / 1024 / 1024 < 2
                var isLt30M = file.size / 1024 /1024 < 30
                var max_file = key === 'treaty_file' ? isLt30M : isLt2M
                if (max_file) {
                    var formData = new FormData()
                    formData.append('file', file)
                    util.showLoading({
                        word: show_word
                    })
                    $.ajax({
                        url: url,
                        type: 'POST',
                        data: formData,
                        contentType: false,
                        cache: false,
                        processData: false
                    }).done(function(res) {
                        if (res.meta.code === 0) {
                            if(key != "treaty_file"){
                                src = res.data.file_link
                                that.data('src', src)
                                sessionStorage.setItem(key, src)
                                that.parents('.upload-text').siblings('.uploadImg').find('img').attr('src', src).fadeIn()
                            } else {
                                href = res.data.file_link;
                                that.data('src', href)
                                $('#agreement_down').text(file.name).attr('href', href).attr('download', file.name);
                            }

                        } else {
                            message({
                                type: 'warning',
                                word: res.meta.message
                            })
                        }
                        util.hideLoading()
                    }).fail(function(res) {
                        console.log(res)
                    })
                } else {
                    message({
                        type: 'warning',
                        word: show_word1
                    })
                }
            }
        })

        $('.pre-view').click(function(e) {
            e.preventDefault()
            var src = $(this).attr('src')
            if (src) {
                modal({
                    title: '图片预览',
                    src: src
                })
            } else {
                modal({
                    content: '请上传图片'
                })
            }
        }).each(function(index) {
            var key = $(this).data('key')
            var src = sessionStorage.getItem(key)
            if (src) {
                $(this).attr('src', src).fadeIn()
                $('#' + key).attr('data-src', src)
            }
        })

        $('#province').change(function() {
            var proId = $(this).val()
            $('#city').empty().append("<option value=''>请选择</option>")
            $('#county').empty().append("<option value=''>请选择</option>")
            queryCity(proId)
        })

        $("#city").change(function() {
            var cityId= $(this).val()
            $("#county").empty().append("<option value=''>请选择</option>")
            queryCounty(cityId)
        })

        function queryProvince() {
                $.ajax({
                    type: 'POST',
                    url: '/school/area_list'
                }).done(function(res){
                    if (res.meta.code === 0) {
                        var data = res.data
                        $.each(data, function(i, items) {
                            $("#province").append("<option value='" + items.code + "'>" + items.name + "</option>")
                        })
                        flag++
                        if (flag === 3) {
                            switchStatus()
                        }
                    }
                })
        }
        function queryCity(proId) {
            var proId = proId || province_code
                $.ajax({
                    type: 'POST',
                    url: '/school/area_list',
                    data: {'province': proId}
                }).done(function(res){
                    if (res.meta.code === 0) {
                        var data = res.data
                        $.each(data, function(i, items) {
                            $("#city").append("<option value='" + items.code + "'>" + items.name + "</option>")
                        })
                        flag++
                        if (flag === 3) {
                            switchStatus()
                        }
                    }
                })
        }
        function queryCounty(cityId) {
            var cityId = cityId || city_code
                $.ajax({
                    type: 'POST',
                    url: '/school/area_list',
                    data: {'city': cityId}
                }).done(function(res){
                    if (res.meta.code === 0) {
                        var data = res.data
                        $.each(data, function(i, items) {
                            $("#county").append("<option value='" + items.code + "'>" + items.name + "</option>")
                        })
                        if (cityId === '441900' || cityId === '442000') {  // 广东东莞和广东中山没有市辖区
                            $("#county").append("<option value='" + cityId + "'>" + '市辖区' + "</option>")
                        }
                        flag++
                        if (flag === 3) {
                            switchStatus()
                        }
                    }
                })
        }

        // $('#token').change(function() {
        //     var token = $(this).val() || classroom_token
        //     $(this).siblings('#classroom_token').val(token)
        // })

        // function getSoftDog() {
        //     $.ajax({
        //         url: '/school/classroom_list',
        //         type: 'GET',
        //     }).done(function(res) {
        //         if (res.meta.code === 0) {
        //             $.each(res.data, function(i, item) {
        //                 // $('#token').append("<option value='" + item.token + "'>" + item.name + "</option>")
        //             })
        //             // if (res.data.length > 0){
        //                 // $("#token").get(0).selectedIndex = 1;
        //                 // $('#classroom_token').val($("#token").val());
        //             // }
        //             flag++
        //             $('#continue').removeAttr('disabled')
        //             if (flag === 4) {
        //                 switchStatus()
        //             }
        //         }
        //     })
        // }

        // 提交表单
        function getFinalData() {
            var result = {}
            $('#auth-form').find('input:text').each(function(i, item) {
                var key = $(this).attr('name')
                var val = $(this).val()
                result[key] = val
            })
            $('#auth-form').find('input:file').each(function(i, item) {
                var key = $(this).attr('name')
                var val = $(this).data('src')
                result[key] = val
            })
            $('#auth-form').find('input:radio').each(function(i, item) {
                if ($(this).is(':checked')) {
                    var key = $(this).attr('name')
                    var val = $(this).val()
                    result[key] = val
                }
            })
            $('#auth-form').find('select').each(function() {
                var key = $(this).attr('name')
                var val = $(this).val()
                if (key) {
                    result[key] = val
                }
            })
            $('#auth-form').find('textarea').each(function() {
                var key = $(this).attr('name')
                var val = $(this).val()
                if (key) {
                    result[key] = val
                }
            })
            $('#auth-form').find('input:checkbox').each(function() {
                var key = $(this).attr('name')
                var val = $(this).is(':checked')
                result[key] = val
            })
            return result
        }
        $('#sendVerify').click(function() {
            var result = getFinalData()
            result.associated_schools = JSON.stringify(associated_schools);
            var formData = new FormData()
            for (var key in result) {
                formData.append(key, result[key])
            }
            var csrf = "{{ csrf }}"
            formData.append('csrf_token', csrf)
            $.ajax({
                type: 'POST',
                url: '/school/real_name_auth',
                data: formData,
                contentType: false,
                processData: false
            }).done(function(res) {
                if (res.meta.code === 0) {
                    message({
                        type: 'success',
                        word: '提交成功'
                    })
                    // 标识 审核中 or 被拒绝 need to do
                    // 被拒绝 继续完善，返回所有数据，填充表单
                    $('#auth-form').css('display', 'none')
                    $('.counting').css('display', 'block')
                    $('.refuse').css('display', 'none')
                    $('.title').css('display','none')
                } else {
                    message({
                        type: 'warning',
                        word: res.meta.message
                    })
                }
            })
        })

        // 继续完善
        $('#continue').click(function () {
            fill_data()
        })

        function fill_data(){
            $('.title').css('display', 'block')
            $('.steps').css('display', 'block')
            $('.counting').css('display', 'none')
            $('.refuse').css('display', 'none')

            // 填充表单
            $('#auth-form').find('input:text').each(function() {
                var key = $(this).attr('name')
                var val = defaultData[key]
                $(this).val(val)
                // if (key === 'classroom_token') {
                //     $('#token').val(val)
                // }
            })
            $('#auth-form').find('input:radio').each(function() {
                var key = $(this).attr('name')
                var val = defaultData[key]
                if ($(this).val() == val) {
                    $(this).attr('checked', 'checked')
                }
            })
            $('#auth-form').find('textarea').each(function() {
                var key = $(this).attr('name')
                var val = defaultData[key]
                $(this).val(val)
            })
            $('#auth-form').find('input:file').each(function() {
                var key = $(this).attr('name')
                var val = defaultData[key]
                $(this).attr('data-src', val)
                $(this).parents('.upload-text').siblings('.uploadImg').find('img').attr('src', val).fadeIn()
            })
            $('#school_type').val(defaultData['school_type'])
            $('#province').val(province_code)
            $('#city').val(city_code)
            $('#county').val(county_code)
        }

        function disabledForm() {
            $('#sendPhone').css('display', 'none')
            $('#auth-form').find('input').attr('disabled', 'disabled')
            $('#auth-form').find('select').attr('disabled', 'disabled')
            $('.upload-btn').css('display', 'none')
            $('#sendVerify').css('display', 'none')
        }

        function undisabldeForm() {
            $('#sendPhone').css('display', 'inline-block')
            $('#auth-form').find('input').removeAttr('disabled')
            $('#auth-form').find('select').removeAttr('disabled')
            $('.upload-btn').css('display', 'block')
            $('#sendVerify').css('display', 'block')
        }

        $('#modify').click(function() {
            undisabldeForm()
        })

        //申请经销店
        function associate_school(){
            // $.ajax({
            //     type: 'GET',
            //     url: '/school/associate_school',
            // }).done(function(res){
            if(schools_all.length>0){
                $('#main-main').text('')
                for(var i=0;i<schools_all.length;i++){
                    $('#main-main').append(schools_all[i].code+','+schools_all[i].name+'<br>')
                    associated_schools.push(schools_all[i].code)
                }
            } else {
                $('#main-main').text('暂无已关联教室！')
            }

            // })
        }
        $('#title_line').on('click', '.span-line', function(){
            var temp_id=$(this).data('id');
            if(temp_id == 'step_one'){
                $('#'+temp_id).removeClass('hide').siblings().addClass('hide');
            } else if(temp_id == 'step_two'){
                if(second){
                    $('#'+temp_id).removeClass('hide').siblings().addClass('hide');
                }
            } else{
                if(third){
                    $('#'+temp_id).removeClass('hide').siblings().addClass('hide');
                }
            }

        })
        $('#footer-box').click(function(){
            if($(this).is(':checked')) {
                // second = true;
                // third = true;
                $('#agreement').addClass('hide');
                $('#one-next').removeClass('not-allowed')
                // $('#line-two').removeClass('not-allowed')
                // $('#line-three').removeClass('not-allowed')
            } else{
                second = false;
                third=false;
                $('#line-two').removeClass('span-active');
                $('#span_small').removeClass('green');
                $('#one-next').addClass('not-allowed')
                $('#line-two').addClass('not-allowed')
                $('#line-three').addClass('not-allowed')
            }
        })
        $('#one-next').click(function(){
            if($('#footer-box').is(':checked')) {
                // $.ajax({
                //     type: 'POST',
                //     url: '/school/agree',
                // }).done(function(res){
                //     if (res.meta.code === 0) {
                        second = true;
                        $('#line-two').removeClass('not-allowed');
                        $('#line-two').addClass('span-active');
                        $('#span_small').addClass('green');
                        $('#agreement').addClass('hide');
                        $('#title-one').removeClass('grey');
                        $('#step_two').removeClass('hide').siblings().addClass('hide');
                    // } else{
                    //     message({
                    //         word: res.meta.message
                    //     })
                    // }
                // })
            } else {
                $('#agreement').removeClass('hide');
            }

        })
        $('#two-next').click(function(){
            third = true;
            $('#line-three').removeClass('not-allowed');
            $('#line-two').addClass('span-active');
            $('#span_small').addClass('green');
            $('#step_three').removeClass('hide').siblings().addClass('hide');
        })
        $('#two-add').click(function(){
            $('#two-box').removeClass('hide');
        })
        $('#two-close').click(function(){
            $('#two-box').addClass('hide');
        })
        $('#input_one').focus(function(){
            $('#correct1').addClass('hide');
            $('#classroom-name').addClass('hide');
            $('#box-id').addClass('hide');
        }).blur(function(){
            var data={
                'school_code':$(this).val()
            }
            if(data.school_code !== ''){
                $.ajax({
                    type: 'POST',
                    url: '/school/school_code_exists',
                    data: data
                }).done(function(res){
                    if (res.data.school_name !== null) {
                        $('#correct1').removeClass('hide');
                        $('#classroom-name').text(res.data.school_name).removeClass('hide');
                    } else{
                        $('#box-id').removeClass('hide');
                    }
                })
            }


        })
        $('#input_two').focus(function(){
            $('#correct2').addClass('hide');
            $('#pass-miss').addClass('hide');
            $('#pass-error').text('').addClass('hide');
        })
        $('#two-sub').click(function(){
            var data={
                school_code: $('#input_one').val(),
                password:$('#input_two').val(),
            }
            if (data.password === "111111"){
                $('#pass-miss').removeClass('hide');
            } else{
                $.ajax({
                    type: 'POST',
                    url: '/school/associate_school',
                    data: data
                }).done(function(res){
                    if (res.meta.code === 0) {
                        associated_schools.push(data.school_code)
                        $('#pass-error').text('').removeClass('hide red').addClass('green');
                        $('#correct2').removeClass('hide');
                        $('#two-box').addClass('hide');
                        $("#addBox").removeClass('hide');
                        setTimeout(function(){
                            $("#addBox").hide()
                        },1500)
                    } else{
                        switch(res.meta.code){
                            case 1:
                                $('#pass-error').text('经销店不存在').removeClass('hide');
                                break;
                            case 2:
                                $('#pass-error').text('被关联的机构不存在').removeClass('hide');
                                break;
                            case 3:
                                $('#pass_span').text('密码错误');
                                $('#pass-miss').removeClass('hide');
                                break;
                            case 4:
                                $('#pass-error').text('该机构已被' + res.meta.message + '关联!').removeClass('hide');
                                break;
                            case 5:
                                $('#pass-error').text('不能关联已经认证的经销店!').removeClass('hide');
                                break;
                            default:
                                break;
                        }
                    }
                })
            }

        })

        associate_school();
	})

</script>
{% endblock %}
